/**
 * Core Navigation
 *
 * @author Cornelius Hansjakob <cha@massiveart.com>
 * @version 1.0
 */

/* ----------------
Basics */

#navigation-top {
  position:relative;
  height:77px;
  width:100%;
}

#top {
	height:17px;
	padding:10px 0 0 0;
}

#navigation-main {
  position:relative;
  height:100%;
}

/* ----------------
Logo & FAQ */

.toplogo {
  float:left;
  height:17px;
  padding:0 5px 0 10px; 
}

.toplogo img {
  border:0;
}

.topright {
  float:right;
  margin:0;
  padding:0 10px 0 0;  
}

.faqtitle {
	float:left;
	margin:0;
	padding:2px 5px 0 0;
}

.faqicon {
  float:left;
}

/* ----------------
User Information */

#userwrapper {
	position:absolute;
	top:37px;
	left:10px;
	width:240px;
	height:40px;
}

#usercontentuser {
	float: left;
	margin: 0 0 0 5px;
}

.usercorner {
	background-color: #e4e4e4;
  width:240px;
  height:4px;
	line-height:4px;
	margin:0;
	padding:0;
	overflow:hidden;
}

.usercorner img {
  padding:0;
  margin:0;
  border:0;
  display:block;
  height:4px;
  width:240px;
}

#usercontent {
	background-color: #e4e4e4;
	width: 220px;
	padding: 0 10px 0 10px;
	margin:0;
	height:32px;
}

#usercontenticon {
	float: left;
	padding-top:3px;
}

#usercontenticon img {
	border: solid 1px #fff;
	display:block;
	margin:0;
	padding:0;
}

/* ----------------
Navigation Top */

#navtopleft {
  background-color:#754480;
  position:absolute;
  top:37px;
  width:5px;
  height:40px;
  left:260px;
}

#navtopleftclient {
  background-color:#754480;
  position:absolute;
  top:37px;
  width:42px;
  height:40px;
  left:260px;
}

#navtopright {
  background-color:#754480;
  position:absolute;
  top:37px;
  width:5px;
  height:40px;
  right:10px;
}

#navtopwrapper {
  position:absolute;
  top:37px;
  left:302px; /* 265px */
  right:15px;
  background-color:#754480;
  height:40px;
}

#navtopinner {
  padding-top:5px;
  padding-left:20px;
  height:40px;
}

#navtopbreadcrumb {
  padding-top:10px;
  padding-left:14px;
  height:30px;
}

.navtop {
  float:left;
  margin-right:10px;
}

.navtopinnerright {
  float:right;
  margin-right:10px;
  margin-left:10px;
}

.navtopcorner {
  width:5px;
  height:30px;
	line-height:0;
	overflow:hidden;
	float:left;
}

.navtopcorner_on {
  width:5px;
  height:30px;
  line-height:0;
  overflow:hidden;
  float:left;
  background-color:#ffd300;
}

.navtopcorner img {
  display:block;
  height:30px;
  width:5px;
}

.navtoplink {
  height:23px;
	padding: 7px 5px 0 5px;
	text-align:center;
	float:left;
}

.navtoplink_on {
  background-color: #ffd300;
  height:23px;
	padding: 7px 5px 0 5px;
	text-align:center;
	float:left;
}

/* ----------------
Navigation Main */

#divNaviLeft {
  background-color:#e4e4e4;
  position:absolute;
  z-index:20;
  top:10px;
  bottom:15px;
  left:10px;
  width:250px;
}

#divNaviCenter {
  background-color:#fff;
  position:absolute;
  z-index:10;
  top:0;
  bottom:0px;
  left:260px;
  right:270px;
  border-top:10px solid #e4e4e4;
  border-bottom:10px solid #e4e4e4;
}

#divNaviRight {
  background-color:#e4e4e4;
  position:absolute;
  z-index:20;
  top:10px;
  bottom:15px;
  right:10px;
  width:260px;
}

/* ----------------
Inner */

#divNaviLeftInner {
  position:relative;
  height:100%;
  overflow:hidden;
}

#divNaviCenterInner {
  position:relative;
  height:100%;
  overflow-y:hidden;
  overflow-x:scroll;
}

#divNaviRightInner {
  position:relative;
  height:100%;
  overflow:hidden;
}

.box230top, .box230bottom {
  background-color:#fff; width: 230px; margin:0 auto 0 auto;
}

#divNaviRightInner div#divFolderRapper {
	text-align: center;
	padding:10px 0 0 0;
}

#divNaviRightInner div#divFolderRapper div.linegray {
  border-bottom:1px solid #e4e4e4;
	font-size:0;
	height:0;
	line-height:0;
	margin:0 10px 5px 10px;
	padding:5px 0 0 0;
	background-color: #fff;
}
#divNaviRightInner div#divFolderRapper div#divFolderInfo {
  background-color:#fff; 
  width: 230px; 
  margin:0 auto 0 auto;
  padding:5px 0 5px 0;
  overflow: hidden;
}

#divNaviRightInner div#divFolderRapper div#divFolderInfo div#divFolderActions {
  text-align:left;	
  margin:0 10px 0 10px;
}

#divNaviRightInner div#divFolderRapper div#divFolderInfo div#divFolderActions div.icon_folder {
	background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 2px -238px;
	width: 25px;
	height: 16px;
	float: left;
	margin: 0 0 5px 0;
}

#divNaviRightInner div#divFolderRapper div#divFolderInfo div#divFolderActions div.icon_list {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 2px -34px;
  width: 25px;
  height: 16px;
  float: left;  
  margin: 0 0 5px 0;
}

/* ----------------
Navigtion left */

#navilefttop {
  position:absolute;
  left:10px;
  top:0;
  bottom:auto;
  background-color:#e4e4e4;
  width:250px;
  height:10px;
}

#navilefttop img {
  display:block;
  width:5px;
  height:5px;
}

#navileftbottom {
  position:absolute;
  left:10px;
  bottom:0px;
  top:auto;
  width:250px;
  height:10px;
  background-color:#e4e4e4;
}

#navileftbottom img {
  display:block;
  width:5px;
  height:5px;
  padding-top:5px;
}

#divNaviLeftMain {
  position:absolute;
  z-index:20;
  bottom:0;
  left:0;
  top:0;
  width:100%;
  overflow-y: auto;
  overflow-x:hidden;
}

.portalcontainer .portaltop,
.portalcontainer .portalbottom {
  width:230px;
  height:4px;
  margin-left:10px;
}

.portal {
  margin-left:10px;
  height:26px;
  width:230px;
  overflow:hidden;
  cursor:pointer;   
}

.portalmenu {
  margin-left:10px;
  width:230px;
  background-color:#fff;
  padding:5px 0 5px 0;
}

.portalmenulink {
  padding:0 0 5px 0;
}

.portal .portalicon,
.portal .imageicon,
.portal .documenticon,
.portal .categoryicon,
.portal .usericon,
.portal .labelicon,
.portal .sysinternicon {
  margin-top:0;
  margin-left:4px;  
  width:21px;
  height:21px;
  float:left;
}

.portal .portalicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -188px;
}

.portal .imageicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -21px;
}

.portal .documenticon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -63px;
}

.portal .categoryicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -105px;
}

.portal .usericon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -147px;
}

.portal .labelicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -272px;
}

.portal .sysinternicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -210px;
}

.selected .portalicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -167px;
}

.selected .imageicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% 0;
}

.selected .documenticon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -42px;
}

.selected .categoryicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -84px;
}

.selected .usericon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -126px;
}

.selected .labelicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -251px;
}

.selected .sysinternicon {
  background:transparent url(/zoolu/images/icons/icons_main.png) no-repeat 50% -231px;
}

.portal .portaltitle {
  height:23px;
  padding-right:0;
  padding-top:3px;
  padding-left:10px;
  float:left;
  width:180px;
  overflow:hidden;
   
}

.portalmenu .portalcontenticon,
.portalmenu .portalwidgetsicon,
.portalmenu .portalsettingsicon {
  margin-top:3px;
  margin-left:35px;  
  width:20px;
  height:16px;
  float:left;
}

.portalmenu .portalcontenticon {
  background:transparent url(/zoolu/images/icons/icon_menu_content.png) no-repeat 0 0;  
}

.portalmenu .portalwidgetsicon {
  background:transparent url(/zoolu/images/icons/icon_menu_widgets.png) no-repeat 0 0;
}

.portalmenu .portalsettingsicon {
  background:transparent url(/zoolu/images/icons/icon_menu_settings.png) no-repeat 0 0;
}

.portalmenu .portalmenutitle {
  height:16px;
  padding-right:0;
  padding-top:3px;
  padding-left:10px;
  float:left;
  width:150px;
  overflow:hidden;
}

#divNaviLeftMain .hover {
  cursor:pointer;
}

#divNaviLeftMain .selected {
  background-color:#fff;
  cursor:pointer;
}

/* overwrite css classes ext */

.x-toolbar {
  background:none;
  border:0;
  padding:0;
}

.x-toolbar td,
.x-toolbar span,
.x-toolbar input,
.x-toolbar div,
.x-toolbar select,
.x-toolbar label {
  font-family: arial, helvetica, sans-serif;
  font-size:12px;
}

.x-btn {
  cursor:pointer;
  font-family: arial, helvetica, sans-serif;
  font-size:12px;
  padding:0;
}

.x-toolbar button {
  color:#fff;
}

.x-toolbar .x-btn-over button {
  color:#fff;
}

.x-btn-left {
  background:none;
  width:0;
  height:0;
}

.x-btn-right {
  background:none;
  width:0;
  height:0;
}

.x-btn-left i, .x-btn-right i {
  display:block;
  font-size:1px;
  line-height:1px;
  overflow:hidden;
  width:0;
}

.x-btn-with-menu .x-btn-center em {
  background:transparent url(/js_incs/ext.js/resources/zoolu/images/default/toolbar/btn-arrow.gif) no-repeat scroll left 0;
  display:block;
  padding-right:0;
  width:15px;
  height:15px;
}

.x-toolbar .x-btn-with-menu .x-btn-center em {
  padding-right:0;
}

/* ----------------
Navigtion right */

#navirighttop {
  background-color:#e4e4e4;
  position:absolute;
  right:10px;
  top:0;
  width:260px;
  height:10px;
}

#navirightbottom {
  background-color:#e4e4e4;
  position:absolute;
  right:10px;
  bottom:0px;
  z-index:30;
  width:260px;
  height:10px;
}

#navirighttop img,
#navirightbottom img {
  display:block;
  width:5px;
  height:5px;
  float:right;
}

#navirightbottom img {
  padding-top:5px;
}

/* ----------------
Navigtion center */

.startpage {
  position:relative;
  padding-right:15px;
  padding-top:2px;
  height:20px;
}

.page,
div.navlevelinner .contact {
  position:relative;
  padding-right:15px;
  padding-top:2px;
  height:20px;
}

.folder, 
.category,
.unit,
.widget {
  background:transparent url(/zoolu/images/icons/arrows.png) no-repeat right 0;
  position:relative;
  padding-right:15px;
  padding-top:2px;
  height:20px;
}

.icon {
  float:left;
  height:15px;
  width:16px;
  margin-left:10px;
  margin-right:5px;
}

.title {
  cursor:pointer;
  overflow:hidden;
  white-space: nowrap;
  padding:0 0 4px 0;
}

.title:after {
  content: '.';
  clear:left;
  visibility:hidden;
}

.navsortpos {
  float:left;
  width:20px;
}

.navsortpos .iptsortpos {
  width:20px;
  border:0;
  background:none;
  cursor:default;
  color:#999;
}

.navsortpos .sortactive {
  cursor:text;
  color:#000;
}

/* ----------------
Icons */

.img_startpage_on {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -136px;
  position:relative;
  width:16px;
  height:16px;
}

.img_startpage_off {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -153px;
  position:relative;
  width:16px;
  height:16px;
}

.img_folder_on, .img_unit {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -255px;
  position:relative;
  width:16px;
  height:16px;
}

.img_folder_off {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -238px;
  position:relative;
  width:16px;
  height:16px;
}

.img_widget_on {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -17px;
  position:relative;
  width:16px;
  height:16px;
}

.img_widget_off {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% 0px;
  position:relative;
  width:16px;
  height:16px;
}

.img_blog_on {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -187px;
  position:relative;
  width:16px;
  height:16px;
}

.img_blog_off {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -170px;
  position:relative;
  width:16px;
  height:16px;
}

.selected .img_folder_on,
.selected .img_unit,
.pselected .img_folder_on {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -221px;
  position:relative;
  width:16px;
  height:16px;
}

.selected .img_folder_off,
.pselected .img_folder_off {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -204px;
  position:relative;
  width:16px;
  height:16px;
}

.img_category_on,
.img_category_off{
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -119px;
  position:relative;
  width:16px;
  height:16px;
}

.img_label_on,
.img_label_off{
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -322px;
  position:relative;
  width:16px;
  height:16px;
}

.img_sysintern_on,
.img_sysintern_off{
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -288px;
  position:relative;
  width:16px;
  height:16px;
}

.img_page_on {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -187px;
  position:relative;
  width:16px;
  height:16px;
}

.img_page_off {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -170px;
  position:relative;
  width:16px;
  height:16px;
}

.img_contact {
  background:transparent url(/zoolu/images/icons/icons_small.png) no-repeat scroll 50% -85px;
  position:relative;
  width:16px;
  height:16px;
}

/* ----------------
Navigtion levels */

.navlevel {
  position:absolute;
  top:0;
  right:auto;
  bottom:0;
  width:200px;
  border-right:1px solid #666;
  padding-top:5px;
}

.navlevelinner {
  position:relative;
  overflow-y:auto;
  overflow-x:hidden;
  height:100%;
}

.navlevelinner .hover {
  background-color:#e4e4e4;
  cursor:pointer;
}

.navlevelinner .active {
  background-color:#e4e4e4;
  cursor:pointer;
}

.navlevelinner .pselected {
  background-color:#e4e4e4;
  cursor:pointer;
}

.navlevelinner .selected {
  background-color:#ffd300;
  cursor:pointer;
}

.navlevelinner .linegray {
  height:0;
  line-height:0;
  font-size:0;
  border-bottom:1px solid #e4e4e4;
  padding:5px 0 0 0;
  margin:0 2px 5px 2px;
}

.levelmenu {
  position:absolute;
  z-index:100;
  left:0;
  bottom:0;
  width:19px;
  height:18px;
  background:transparent url(/zoolu/images/icons/bg_add_icon.png) no-repeat top left;
  padding:2px 0 0 1px;
  overflow:hidden;
  cursor:pointer; 
}

.addmenuhover {
  background:transparent url(/zoolu/images/icons/bg_add_icon.png) no-repeat bottom left;
}

.addmenu {
  position:absolute;
  z-index:110;
  bottom:0;
  left:0;
  width:150px;
  overflow:hidden; 
}

.addmenutopleft {
  float:left;
  height:5px;
  width:145px;
  background-color:#754480;
}

.addmenutopright {
  float:left;
  width:5px;
  height:5px;
  background:transparent url(/zoolu/images/main/corner_addmenue_top_right.png) no-repeat top right;
}

.addmenucontent {
  width:150px;
  background-color:#754480;
  padding:0 0 5px 0;
}

.addmenucontent .addmenuelement {
  height:18px;
  padding:0 0 2px 0;
}

.addmenucontent .icon {
  width:16px;
  height:16px;
  border:0;
  float:left;
  cursor:pointer;  
}

.addmenuelement div {
  float:left;
  padding:2px 0 0 0;
  cursor:pointer;
}


